<template>
<Form v-if="showPage" :label-width="100">
	<FormItem label="物流信息跟踪" prop="enabledTrackWuliu">
		<i-switch v-model="model.enabledTrackWuliu" size="large" :disabled="!isEditing">
			<span slot="open">开启</span>
			<span slot="close">关闭</span>
		</i-switch>
	</FormItem>
	<FormItem label="短信通知发货" prop="enabledSendSMSWhenShipped">
		<i-switch v-model="model.enabledSendSMSWhenShipped" size="large" :disabled="!isEditing">
			<span slot="open">开启</span>
			<span slot="close">关闭</span>
		</i-switch>
	</FormItem>
	<FormItem label="运费模板" prop="shippingTemplateType">
		<Select v-model="model.shippingTemplateType" w7 :disabled="!isEditing">
			<Option :value="0">固定运费</Option>
			<Option :value="1">阶梯运费</Option>
		</Select>
	</FormItem>
	<FormItem>
		<Button v-if="!isEditing" type="primary" @click="handleEdit">修改</Button>
		<Button v-if="isEditing" type="primary" @click="handleSave" mgr2>保存</Button>
		<Button v-if="isEditing" @click="handleCancel">取消</Button>
	</FormItem>
</Form>
</template>

<script lang="ts">
import { Component, Vue,Inject, Prop,Watch } from 'vue-property-decorator';
import AbpBase from '../../../lib/abpbase';

@Component({
	components: {}
})
export default class ShipSetting extends AbpBase{
	model:any = {
		enabledTrackWuliu: false,
		enabledSendSMSWhenShipped: false,
		shippingTemplateType: 0
	}
	handleEdit() {
		this.isEditing = true;
	}
	async handleSave() {
		await this.setData();
		this.isEditing = false;
	}
	async handleCancel() {
		await this.getData();
		this.isEditing = false;
	}
	async getData() {
		var response = await this.get('Setting/GetShipSetting');
		if(response.success) {
			this.model = response.result;
		}
	}
	async setData() {
		var response = await this.post('Setting/SetShipSetting', this.model);
		if(response.success) {
			this.$store.commit('setting/setShipSetting', this.model);
			this.success('保存成功');
		}
	}
	async created() {
		this.showPage = false;
		await this.getData();
		this.showPage = true;
	}
}
</script>